<!-- 绿色通道 - 患者列表 - 医疗记录 - 体格检查 界面 -->
<template>
  <div class="body">
    <div class="add-button">
      <el-button type="primary" @click.stop="openAdd()"> 添加 </el-button>
      <!-- <el-button type="primary" @click="getInfo()"> getInfo </el-button> -->
      <!-- <el-button type="primary" @click="getGrace()"> getGrace </el-button> -->
      <!-- <el-button type="primary" @click="getScores()"> Score </el-button> -->
    </div>
    <el-row v-if="!hasData" class="no-data">
      <h3 align="center">无数据</h3>
    </el-row>
    <el-row v-if="hasData">
      <el-form
        v-for="(graceItem, graceIndex) in graceForm"
        :key="'grace' + graceIndex"
        :model="graceItem"
        label-position="left"
        label-width="150px"
        class="checkUp"
      >
        <el-row type="flex" justify="end" align="middle" class="title">
          <div>{{ graceItem.createdAt }}</div>
          <div>{{ graceItem.userName }}</div>
          <div>
            <el-button type="primary" size="mini" @click="save(graceIndex)">
              保存
            </el-button>
          </div>
        </el-row>
        <el-row type="flex" :gutter="20">
          <el-col :sm="12">
            <el-form-item label="KILLIP分级：">
              <el-radio-group v-model="graceItem.killip">
                <el-radio
                  v-for="(killipItem, killipIndex) in killipList"
                  :key="'killip' + killipIndex"
                  :label="killipItem.killipCode"
                >
                  {{ killipItem.killipName }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :sm="12">
            <el-form-item label="收缩压(mmHg)：">
              <el-radio-group v-model="graceItem.sys">
                <el-radio
                  v-for="(sysItem, sysIndex) in sysList"
                  :key="'sys' + sysIndex"
                  :label="sysItem.sysCode"
                >
                  {{ sysItem.sysName }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" :gutter="20">
          <el-col :sm="12">
            <el-form-item label="心率（次/Min）：">
              <el-radio-group v-model="graceItem.hr">
                <el-radio
                  v-for="(hrItem, hrIndex) in hrList"
                  :key="'hrRate' + hrIndex"
                  :label="hrItem.hrCode"
                >
                  {{ hrItem.hrName }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :sm="12">
            <el-form-item label="年龄（岁）：">
              <el-radio-group v-model="graceItem.age">
                <el-radio
                  v-for="(ageItem, ageIndex) in ageList"
                  :key="'age' + ageIndex"
                  :label="ageItem.ageCode"
                >
                  {{ ageItem.ageName }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" :gutter="20">
          <el-col :sm="12">
            <el-form-item label="肌酐（umol/L）：">
              <el-radio-group v-model="graceItem.creatinine">
                <el-radio
                  v-for="(creatinineItem, creatinineIndex) in creatinineList"
                  :key="'creatinine' + creatinineIndex"
                  :label="creatinineItem.creatinineCode"
                >
                  {{ creatinineItem.creatinineName }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :sm="12">
            <el-form-item label="危险因素：">
              <el-checkbox-group v-model="graceItem.dangersCheck">
                <el-checkbox
                  v-for="(dangersItem, dangersIndex) in dangersList"
                  :key="'dangers' + dangersIndex"
                  :label="dangersItem.dangersCode"
                >
                  {{ dangersItem.dangersName }}
                </el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="GRACE极高危条件：">
            <el-checkbox-group v-model="graceItem.conditionsCheck">
              <el-row>
                <el-checkbox
                  v-for="(conditionsItem, conditionsIndex) in conditionsList"
                  :key="'conditions' + conditionsIndex"
                  :label="conditionsItem.conditionsCode"
                >
                  {{ conditionsItem.conditionsName }}
                </el-checkbox>
              </el-row>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row type="flex">
          <el-form-item label="GRACE分值与结论：">
            <el-row type="flex">
              <div style="width: 100px; margin-right: 20px">
                <el-input v-model="graceItem.score" disabled />
              </div>
              <div style="width: 200px; margin-right: 20px">
                <el-input v-model="graceItem.resultName" disabled />
              </div>
            </el-row>
          </el-form-item>
        </el-row>
      </el-form>
    </el-row>
    <el-dialog title="添加Grace" :visible.sync="graceDiaVisible" center>
      <el-form
        ref="addGraceForm"
        :model="addGraceForm"
        :rules="addFormRules"
        label-position="left"
        label-width="150px"
        class="checkUp checkUpAddDia"
        style="padding: 0; border: 0"
      >
        <el-form-item label="KILLIP分级：" prop="killip">
          <el-radio-group v-model="addGraceForm.killip">
            <el-radio
              v-for="(killipItem, killipIndex) in killipList"
              :key="'killip' + killipIndex"
              :label="killipItem.killipCode"
            >
              {{ killipItem.killipName }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="收缩压(mmHg)：" prop="sys">
          <el-radio-group v-model="addGraceForm.sys">
            <el-radio
              v-for="(sysItem, sysIndex) in sysList"
              :key="'sys' + sysIndex"
              :label="sysItem.sysCode"
            >
              {{ sysItem.sysName }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="心率（次/Min）：" prop="hr">
          <el-radio-group v-model="addGraceForm.hr">
            <el-radio
              v-for="(hrItem, hrIndex) in hrList"
              :key="'hrRate' + hrIndex"
              :label="hrItem.hrCode"
            >
              {{ hrItem.hrName }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="年龄（岁）：" prop="age">
          <el-radio-group v-model="addGraceForm.age">
            <el-radio
              v-for="(ageItem, ageIndex) in ageList"
              :key="'age' + ageIndex"
              :label="ageItem.ageCode"
            >
              {{ ageItem.ageName }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="肌酐（umol/L）：" prop="creatinine">
          <el-radio-group v-model="addGraceForm.creatinine">
            <el-radio
              v-for="(creatinineItem, creatinineIndex) in creatinineList"
              :key="'creatinine' + creatinineIndex"
              :label="creatinineItem.creatinineCode"
            >
              {{ creatinineItem.creatinineName }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="危险因素：">
          <el-checkbox-group v-model="addGraceForm.dangersCheck">
            <el-checkbox
              v-for="(dangersItem, dangersIndex) in dangersList"
              :key="'dangers' + dangersIndex"
              :label="dangersItem.dangersCode"
            >
              {{ dangersItem.dangersName }}
            </el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="GRACE极高危条件：">
          <el-checkbox-group v-model="addGraceForm.conditionsCheck">
            <el-row>
              <el-checkbox
                v-for="(conditionsItem, conditionsIndex) in conditionsList"
                :key="'conditions' + conditionsIndex"
                :label="conditionsItem.conditionsCode"
              >
                {{ conditionsItem.conditionsName }}
              </el-checkbox>
            </el-row>
          </el-checkbox-group>
        </el-form-item>
        <el-row>
          <el-form-item label="GRACE分值与结论：">
            <el-row type="flex">
              <div style="width: 100px; margin-right: 20px">
                <el-input v-model="addGraceForm.score" disabled />
              </div>
              <div style="width: 200px; margin-right: 20px">
                <el-input v-model="addGraceForm.resultName" disabled />
              </div>
            </el-row>
          </el-form-item>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="graceDiaVisible = false"> 取 消 </el-button>
        <el-button type="primary" @click="add"> 确 定 </el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { getInfo, getGrace, saveGrace } from '@/api/green-channel/check-up'
export default {
  props: {
    checkrowdata: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {
      hasData: false,
      graceDiaVisible: false,
      graceForm: [],
      addGraceForm: {
        killip: '',
        sys: '',
        hr: '',
        age: '',
        creatinine: '',
        dangersCheck: [],
        conditionsCheck: []
      },
      radioFieldList: ['killip', 'sys', 'hr', 'age', 'creatinine'],
      // KILLIP分级
      killipList: [
        { killipCode: '0', killipName: 'I级', killipScore: 0 },
        { killipCode: '1', killipName: 'II级', killipScore: 20 },
        { killipCode: '2', killipName: 'III级', killipScore: 39 },
        { killipCode: '3', killipName: 'IV级', killipScore: 59 }
      ],
      // 收缩压(mmHg)
      sysList: [
        { sysCode: '0', sysName: '＜80', max: 80, sysScore: 58 },
        { sysCode: '1', sysName: '80~99', min: 80, max: 99, sysScore: 53 },
        { sysCode: '2', sysName: '100~119', min: 100, max: 119, sysScore: 43 },
        { sysCode: '3', sysName: '120~139', min: 120, max: 139, sysScore: 34 },
        { sysCode: '4', sysName: '140~159', min: 140, max: 159, sysScore: 24 },
        { sysCode: '5', sysName: '160~199', min: 160, max: 199, sysScore: 10 },
        { sysCode: '6', sysName: '≥200', min: 200, sysScore: 0 }
      ],
      // 心率（次/Min）
      hrList: [
        { hrCode: '0', hrName: '＜50', max: 50, hrScore: 0 },
        { hrCode: '1', hrName: '50~69', min: 50, max: 69, hrScore: 3 },
        { hrCode: '2', hrName: '70~89', min: 70, max: 89, hrScore: 9 },
        { hrCode: '3', hrName: '90~109', min: 90, max: 109, hrScore: 15 },
        { hrCode: '4', hrName: '110~149', min: 110, max: 149, hrScore: 24 },
        { hrCode: '5', hrName: '150~199', min: 150, max: 199, hrScore: 38 },
        { hrCode: '6', hrName: '≥200', min: 200, hrScore: 46 }
      ],
      // 年龄（岁）
      ageList: [
        { ageCode: '0', ageName: '＜30', max: 30, ageScore: 0 },
        { ageCode: '1', ageName: '30~39', min: 30, max: 39, ageScore: 8 },
        { ageCode: '2', ageName: '40~49', min: 40, max: 49, ageScore: 25 },
        { ageCode: '3', ageName: '50~59', min: 50, max: 59, ageScore: 41 },
        { ageCode: '4', ageName: '60~69', min: 60, max: 69, ageScore: 58 },
        { ageCode: '5', ageName: '70~79', min: 70, max: 79, ageScore: 75 },
        { ageCode: '6', ageName: '80~89', min: 80, max: 89, ageScore: 91 }
      ],
      // 肌酐（umol/L）
      creatinineList: [
        {
          creatinineCode: '0',
          creatinineName: '0~34',
          min: 0,
          max: 34,
          creatinineScore: 1
        },
        {
          creatinineCode: '1',
          creatinineName: '35~70',
          min: 35,
          max: 70,
          creatinineScore: 4
        },
        {
          creatinineCode: '2',
          creatinineName: '71~105',
          min: 71,
          max: 105,
          creatinineScore: 7
        },
        {
          creatinineCode: '3',
          creatinineName: '106~141',
          min: 106,
          max: 141,
          creatinineScore: 10
        },
        {
          creatinineCode: '4',
          creatinineName: '141~176',
          min: 141,
          max: 176,
          creatinineScore: 13
        },
        {
          creatinineCode: '5',
          creatinineName: '177~353',
          min: 177,
          max: 353,
          creatinineScore: 21
        },
        {
          creatinineCode: '6',
          creatinineName: '≥354',
          min: 354,
          creatinineScore: 38
        }
      ],
      // 危险因素
      dangersList: [
        {
          dangersCode: '1',
          dangersName: '发病后曾出现心脏骤停',
          dangersScore: 39
        },
        {
          dangersCode: '2',
          dangersName: '心电图ST段改变',
          dangersScore: 28
        },
        {
          dangersCode: '3',
          dangersName: '心肌坏死标志物升高',
          dangersScore: 14
        }
      ],
      // GRACE极高危条件
      conditionsList: [
        { conditionsCode: '1', conditionsName: '急性心力衰竭' },
        { conditionsCode: '2', conditionsName: '致命性心律失常或心脏骤停' },
        { conditionsCode: '3', conditionsName: '血液动力学不稳定或心源性休克' },
        { conditionsCode: '4', conditionsName: '心肌梗死合并机械并发症' },
        {
          conditionsCode: '5',
          conditionsName: '反复的ST-T动态改变，尤其是伴随间歇性ST段抬高'
        },
        {
          conditionsCode: '6',
          conditionsName: '药物治疗无效的反复发作或持续性胸痛'
        }
      ],
      resultList: [
        { resultCode: '4', resultName: '低危', max: 109, drpMax: 1 },
        {
          resultCode: '3',
          resultName: '中危',
          min: 109,
          max: 139,
          drpMin: 1,
          drpMax: 3
        },
        { resultCode: '2', resultName: '高危', min: 140, max: 200, drpMin: 3 },
        { resultCode: '1', resultName: '极高危', min: 201 }
      ],
      addFormRules: {
        killip: [{ required: true, message: ' ', trigger: 'change' }],
        sys: [{ required: true, message: ' ', trigger: 'change' }],
        hr: [{ required: true, message: ' ', trigger: 'change' }],
        age: [{ required: true, message: ' ', trigger: 'change' }],
        creatinine: [{ required: true, message: ' ', trigger: 'change' }]
      }
    }
  },

  watch: {
    graceForm: {
      handler(newValue, oldValue) {
        this.getScores()
      },
      deep: true
    },
    addGraceForm: {
      handler(newValue, oldValue) {
        this.addGraceForm = this.getScore(newValue)
      },
      deep: true
    }
  },
  created() {
    this.getGrace()
  },
  methods: {
    // grace表单获取接口
    getGrace() {
      getGrace({ dispatchId: this.checkrowdata.dispatchId }).then((res) => {
        if (res.data.length <= 0) {
          this.getInfo()
        } else {
          this.hasData = true
          this.graceForm = this.setGraceList(res.data)
        }
      })
    },
    // grace表单列表的数据处理
    setGraceList(list) {
      list.forEach((data) => {
        if (data.dangers != null && data.dangers) {
          data.dangersCheck = data.dangers.split('|')
        } else {
          data.dangersCheck = []
        }
        if (data.conditions != null && data.conditions) {
          data.conditionsCheck = data.conditions.split('|')
        } else {
          data.conditionsCheck = []
        }
        const info = data.info.split('|')
        data.killip = info[0]
        data.sys = info[1]
        data.hr = info[2]
        data.age = info[3]
        data.creatinine = info[4]
        data.resultName = this.getName('result', data.result)
      })
      return list
    },
    // 当grace没有信息调取getInfo接口
    getInfo() {
      getInfo({ dispatchId: this.checkrowdata.dispatchId }).then((res) => {
        if (!this.isInfo(res.data)) {
          this.hasData = false
        } else {
          this.hasData = true
          this.graceForm = []
          const data = res.data
          if (data.killip && parseInt(data.killip) > 0) {
            data.killip = parseInt(data.killip) - 1 + ''
          }
          data.sys = this.judgeScore('sys', data.sys)
          data.hr = this.judgeScore('hr', data.hr)
          data.age = this.judgeScore('age', data.age)
          data.creatinine = this.judgeScore('creatinine', data.creatinine)
          data.dangersCheck = []
          data.conditionsCheck = []
          data.score = ''
          data.result = ''
          data.resultName = ''
          this.graceForm.push(data)
        }
      })
    },
    // 判断getInfo接口是否存有值
    isInfo(data) {
      let is = false
      this.radioFieldList.forEach((item) => {
        if (data[item]) {
          is = true
        }
      })
      return is
    },
    // 获取值域中的名称
    getName(field, val) {
      let str = ''
      if (this[field + 'List'].length <= 0) {
        return str
      } else {
        this[field + 'List'].forEach((item) => {
          if (val === item[field + 'Code']) {
            str = item[field + 'Name']
          }
        })
      }
      return str
    },
    // 判断getInfo信息中字段对应值域的key
    judgeScore(field, data) {
      const num = parseInt(data)
      let score = ''
      this[field + 'List'].forEach((item) => {
        if (item.max && item.min && num <= item.max && num >= item.min) {
          score = item[field + 'Code']
        }
        if (!item.max && num >= item.min) {
          score = item[field + 'Code']
        }
        if (!item.min && num < item.max) {
          score = item[field + 'Code']
        }
      })
      return score
    },
    // 获取graceForm表单list所有分值
    getScores() {
      this.graceForm.forEach((item) => {
        item = this.getScore(item)
      })
    },
    // 获取表单一个分值
    getScore(item) {
      let sum = 0
      this.radioFieldList.forEach((field) => {
        this[field + 'List'].forEach((data) => {
          if (data[field + 'Code'] === item[field]) {
            sum += data[field + 'Score']
          }
        })
      })
      item.dangersCheck.forEach((danger) => {
        this.dangersList.forEach((data) => {
          if (data.dangersCode === danger) {
            sum += data.dangersScore
          }
        })
      })
      item.score = sum + ''
      item.result = this.getResult(item).result
      item.resultName = this.getResult(item).resultName
      return item
    },
    // 获取结论
    getResult(item) {
      let result = ''
      result = this.judgeScore('result', item.score)
      if (item.dangersCheck.findIndex((el) => el === '3') > -1) {
        result = '2'
      }
      if (item.conditionsCheck.length > 0) {
        result = '1'
      }
      const obj = {
        result: result,
        resultName: this.getName('result', result)
      }
      return obj
    },
    // 保存接口
    save(index) {
      this.saveData(this.graceForm[index])
      if (!this.graceForm[index].id) {
        this.addIdInfo(this.graceForm[index])
      }

      saveGrace(this.graceForm[index]).then((res) => {
        this.$message.success('保存成功')
        this.getGrace()
      })
    },
    saveData(data) {
      const arr = []
      this.radioFieldList.forEach((item) => {
        if (data[item]) {
          arr.push(data[item])
        } else {
          arr.push('')
        }
      })
      data.info = arr.join('|')
      data.dangers = data.dangersCheck.join('|')
      data.conditions = data.conditionsCheck.join('|')
      return data
    },
    addIdInfo(data) {
      data.dispatchId = this.checkrowdata.dispatchId
      data.userId = this.$store.getters.userId
      return data
    },
    openAdd() {
      this.graceDiaVisible = true
    },
    // 添加
    add() {
      this.addGraceForm = this.saveData(this.addGraceForm)
      this.addIdInfo(this.addGraceForm)
      this.$refs.addGraceForm.validate((valid) => {
        if (valid) {
          saveGrace(this.addGraceForm).then((res) => {
            this.$message.success('添加成功')
            this.addGraceForm = {
              dangersCheck: [],
              conditionsCheck: []
            }
            this.getGrace()
            this.graceDiaVisible = false
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.body {
  padding-left: 20px;
  padding-right: 20px;
  font-size: 14px;
  color: #606266;
  .no-data {
    padding: 20px 40px;
    color: #000;
    font-size: 1.17em;
  }
  .add-button {
      // position: fixed;
      // z-index: 9999;
      // bottom: 150px;
      //  right: 170px;
      text-align: right;
      padding-bottom: 15px;
  }
  .checkUp {
    padding: 12px 30px 20px;
    border-bottom: 1px solid #dfe4ed;
    .el-form-item__label {
      font-weight: normal;
    }
    .el-radio {
      margin-right: 0;
      min-width: 80px;
    }
    .el-form-item {
      margin-bottom: 0;
    }
    .title div {
      margin-right: 20px;
      font-size: 16px;
    }
  }
  .checkUpAddDia {
    margin-left: 10%;
  }
}
</style>
<style lang="scss">
.body {
  .checkUp {
    .el-form-item__label {
      font-weight: normal;
    }
    .el-radio__label {
      padding-left: 0px;
      font-size: 13px;
    }
    .el-form-item.is-error .el-radio__inner {
      border-color: #ff4949;
    }
  }
}
</style>
